/* Structural elements */


/* Horizontal (left-labelled) box */

.fsBoxH:after, .fsBoxH2:after, .fsBoxV:after, .fsBoxV2:after {
clear: left;
display: block;
visibility: hidden;
overflow: hidden;
height: 0 !important;
line-height: 0;
font-size: xx-large;
content: " x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";
}

.fsBoxH2 {
display: table-cell;
zoom: 1;
vertical-align: top;
}

.fsBoxH2 > :first-child{
margin-top:0;
}

.fsBoxH2 > :last-child{
margin-bottom:0;
}

.fsBoxH1 {
float: left;
margin-right: 5px;
}


/* Vertical (top-labelled) box */

.fsBoxV2 {
display: table-cell;
zoom: 1;
vertical-align: top;
}

.fsBoxV2 > :first-child{
margin-top:0;
}

.fsBoxV2 > :last-child{
margin-bottom:0;
}


/* Flow box */

.fsBoxF, .fsBoxF1, .fsBoxF2 {
float: left;
}

.fsBoxF1 {
margin-right: 5px;
}

.fsBoxF2 {
margin-right: 10px;
}


/* Grid & Column elements */

.ftEditColumns, .ftViewColumns {
margin: 0;
border-collapse: collapse;
border: none;
}

.ftEditColumns th, .ftEditColumns td, .ftViewColumns th, .ftViewColumns td {
padding: 0 10px 0 0;
border: none;
vertical-align: top;
text-align: left;
}

.ftEditGrid, .ftViewGrid {
margin: 0;
border-collapse: collapse;
border: none;
width: 100%;
}

.ftEditGrid th, .ftEditGrid td, .ftViewGrid th, .ftViewGrid td {
padding: 3px 7px 3px 3px;
border: 1px solid #d9d9d9;
vertical-align: top;
text-align: left;
}


/* Theme elements */

.ftEditForm, .ftViewForm {
width: auto;
}

.ftEditPageDisabled, .ftViewPageDisabled, .ftEditSectionDisabled, .ftViewSectionDisabled {
opacity: 0.5;
}

.ftEditSection, .ftViewSection {
margin: 14px 0;
}

.ftEditSectionAbove .ftEditQuestion, .ftEditSectionIndent .ftEditQuestion, .ftViewSectionAbove .ftViewQuestion, .ftViewSectionIndent .ftViewQuestion {
margin: 14px 0;
}

.ftEditSectionLeft .ftEditQuestion, .ftViewSectionLeft .ftViewQuestion {
margin: 10px 0;
}

.ftEditSectionLeft .ftEditLabel, .ftViewSectionLeft .ftViewLabel {
margin-top: 2px;
width: 160px;
}

.ftEditSectionIndent .ftEditIndent, .ftViewSectionIndent .ftViewIndent {
width: 160px;
}

.ftEditSectionButtons, .ftEditGrid .ftEditSectionButtons {
text-align: right;
padding-top: 3px;
padding-bottom: 3px;
}

.ftEditBody, .ftViewBody {
padding-right: 7px;
/* word-break: break-all; */
}

div.htmlReferenceQuestion {
color: #909090;
background-color: #f8f8f8;
border: 1px solid #767676;
min-height: 100px;
cursor: not-allowed;
}

.ftChoiceSelect.ftReferenceQuestion {
background-color: #f8f8f8 !important;
border: 1px solid #767676 !important;
cursor: not-allowed;
}

.select2-container-multi.select2-container-disabled .select2-choices {
background-color: #f8f8f8 !important;
border: 1px solid #767676 !important;
cursor: not-allowed;
}

div.text-input {
width: 92%;
max-height: 18px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin: 3px 0 2px;
border: 1px solid #c4c4c4;
border-radius: 3px;
padding: 3px 2px 3px 5px;
background-color: #f8f8f8;
}

.forceWrap {
overflow-wrap:break-word;
word-wrap:break-word;
word-break:break-all;
word-break:break-word;
}

span.longResponseView {
white-space: pre-wrap;
}

.ftEditLabel, .ftViewLabel {
font-weight: bold;
}

.ftEditTotal, .ftViewTotal {
font-weight: bold;
}

.ftEditPageHeading, .ftViewPageHeading {
font-size: 123.1%;
color: #1E6F8C;
}

.ftEditChoice, .ftViewChoice {
margin: 3px 0;
}

.ftEditHint, .ftViewHint {
color: #666;
font-size: 85%;
}

.ftValidError {
margin: 6px 0 10px 0 !important;
}

/* Specific question types */

.ftEditName {
max-width: 500px;
}

.ftEditAddress {
max-width: 500px;
}

.ftFixedWidthTable {
max-width: 500px;
}

.ftEditBudget {
width: 100%;
margin: 1px 0 5px;
border-collapse: collapse;
}
.ftEditBudget th, .ftEditBudget td {
vertical-align: top;
border: 1px solid #999;
padding: 3px 9px 3px 4px;
}

.ftEditBudget tr.total th {
text-align: right;
}

.ftEditBudget input {
width: 100%;
}

.ftEditBudget td.amt input {
text-align: right;
}

.ftEditBudget .isNaN {
background-color: #FFDDDD;
}


/* Field table layout */

.ftFieldTable {
width: 100%;
margin: 0;
border-collapse: collapse;
border: none;
}

.ftFieldTable th, .ftFieldTable td {
padding: 0 7px 1px 0;
border: none;
vertical-align: top;
text-align: left;
}


/* Field layout */

.ftFieldLabel {
display: block;
margin: 2px 1px 0 1px;
}


.ftFieldText, input[type="text"].ftFieldText, .ftFieldTextarea, textarea.ftFieldTextarea {
width: 100%;
}

.ftFieldRadio, .ftFieldCheckbox {
margin-top: 1px;
}

.ftFieldShort, input[type="text"].ftFieldShort, .ftFieldDate, input[type="text"].ftFieldDate {
max-width: 120px;
}

.ftFieldMedium, input[type="text"].ftFieldMedium {
max-width: 300px;
}

.ftFieldNameTitle {
margin-right: 6px;
}

.ftAsteriskText {
color: #C00;
font-weight: bold;
}

.properAsterisk {
font-size: 120%;
color: #C00;
}

.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}

/* ABN Information Box */

.ftAbnInfo {
margin: 5px 0 0 4px;
font-size: 93%;
}

.ftAbnInfo table {
margin: 5px 0 0 -4px;
border-collapse: collapse;
border: 1px solid #999;
min-width: 450px;
}

.ftAbnInfo thead th {
background-color: #ddd;
}

.ftAbnInfo th, .ftAbnInfo td {
background-color: #eee;
padding: 2px 4px;
border: none;
text-align: left;
}

.ftOther {
padding:5px;
}


/* Clear radio buttons */

.ftRadioClear {
font-size: 85%;
margin-left: 18px;
}


/* Repeating Section separators */


.ftSectionRepeatSeparator {
    text-align: right;
    margin-top: 2em;
    padding: 1em 2em;
    font-size: 88%;
    border-top: dashed #bbb 1px;
  }

.ftSectionRepeatSeparatorLabel {
  display: block;
  width: fit-content;
  float: right;
  margin-top: -1.8em;
  padding: 0 0.3em;
  color: #bbb;
  background: #fff;
}



/* Large grid handling */

.modal-action-grid {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding: 6px 15px 0 0;
}

.ftShowGridPopup, .ftHideGridPopup {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  margin-bottom: 1em;
  padding: 0;
}

.sectionGridBody {
  overflow: auto;
}

.ftSectionGridFooter {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  padding: 6px 15px 0 0;
}
